<%@ taglib prefix="c" uri="jakarta.tags.core" %>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <base href="<%=request.getContextPath()%>/">
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>个人信息</title>
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css">
    <link rel="stylesheet" href="statics/css/hisStyle.css">
    <link rel="stylesheet" href="statics/css/common-styles.css">
</head>
<body>
<%@include file="../common/sidebar.jsp"%>
<div class="main-content">
    <%@include file="../common/top.jsp"%>
    <div class="function-page">
        <!-- 全局用户对象检查 -->
        <c:if test="${empty user}">
            <div class="card empty-message">
                <i class="fas fa-exclamation-circle fa-3x empty-icon"></i>
                <div class="empty-text">无法获取用户信息，请重新登录！</div>
                <button class="btn btn-primary" onclick="window.location.href='toAdminLogin'">
                    前往登录
                </button>
            </div>
        </c:if>
        
        <!-- 用户信息展示 -->
        <c:if test="${not empty user}">
            <div class="data-section">
                <!-- 消息提示 -->
                <c:if test="${not empty success}">
                    <div class="message success-message">${success}</div>
                </c:if>
                <c:if test="${not empty error}">
                    <div class="message error-message">${error}</div>
                </c:if>
                
                <c:choose>
                    <c:when test="${empty editMode}">
                        <!-- 查看模式 -->
                        <div class="page-header">
                            <div class="profile-content">
                                <c:choose>
                                    <c:when test="${user.headpic != null && user.headpic != ''}">
                                        <img src="statics/images/adminHead/${user.headpic}" alt="用户头像" class="profile-avatar">
                                    </c:when>
                                    <c:otherwise>
                                        <img src="statics/images/adminHead/admin.png" alt="默认头像" class="profile-avatar">
                                    </c:otherwise>
                                </c:choose>
                                <div class="profile-info">
                                <h2 class="section-title">${user.username}</h2>
                                <p>
                                    <c:choose>
                                        <c:when test="${user.type == 1}">用户类型：患者</c:when>
                                        <c:when test="${user.type == 2}">用户类型：医生</c:when>
                                        <c:when test="${user.type == 3}">用户类型：管理员</c:when>
                                        <c:otherwise>用户类型：未知</c:otherwise>
                                    </c:choose>
                                </p>
                            </div>
                        </div>
                    </div>
                </div>
                
                <div class="data-table-container">
                    <table class="data-table">
                        <tbody>
                        
                            <tr>
                                <td>用户名</td>
                                <td>${user.username}</td>
                            </tr>
                            <tr>
                                <td>性别</td>
                                <td>
                                    <c:choose>
                                        <c:when test="${user.sex == 1}">男</c:when>
                                        <c:when test="${user.sex == 2}">女</c:when>
                                        <c:otherwise>未设置</c:otherwise>
                                    </c:choose>
                                </td>
                            </tr>
                            <tr>
                                <td>联系电话</td>
                                <td>${user.phone != null ? user.phone : '未设置'}</td>
                            </tr>
                            <tr>
                                <td>身份证号</td>
                                <td>${user.idcard != null ? user.idcard : '未设置'}</td>
                            </tr>
                        </tbody>
                    </table>
                </div>
                            

                        
                        <div class="btn-group">
                            <button class="btn btn-primary" onclick="switchToEditMode()">
                                <i class="fas fa-edit"></i> 编辑个人信息
                            </button>
                            <button class="btn btn-secondary" onclick="window.location.href='logout'">
                                <i class="fas fa-sign-out-alt"></i> 退出登录
                            </button>
                        </div>
                    </c:when>
                    <c:otherwise>
                        <!-- 编辑模式 -->
                        <form id="profileForm" method="post" action="user/updateProfile" enctype="multipart/form-data">
                            <input type="hidden" name="userid" value="${user.userid}">
                             
                            <div class="profile-header">
                                <c:choose>
                                    <c:when test="${user.headpic != null && user.headpic != ''}">
                                        <img src="statics/images/adminHead/${user.headpic}" alt="用户头像" class="profile-avatar">
                                    </c:when>
                                    <c:otherwise>
                                        <img src="statics/images/adminHead/admin.png" alt="默认头像" class="profile-avatar">
                                    </c:otherwise>
                                </c:choose>
                                <div class="profile-info">
                                <h2 class="section-title">编辑个人信息</h2>
                            </div>
                            </div>
                             
                            <div class="data-table-container">
                                <table class="data-table">
                                    <tbody>
                                        <tr>
                                            <td><label for="username">用户名</label></td>
                                            <td><input type="text" id="username" class="form-control" name="username" value="${user.username}" placeholder="输入用户名"></td>
                                        </tr>
                                        <tr>
                                            <td><label for="sex">性别</label></td>
                                            <td>
                                                <select id="sex" class="form-control" name="sex">
                                                    <option value="0" <c:if test="${user.sex == 0}">selected</c:if>>未设置</option>
                                                    <option value="1" <c:if test="${user.sex == 1}">selected</c:if>>男</option>
                                                    <option value="2" <c:if test="${user.sex == 2}">selected</c:if>>女</option>
                                                </select>
                                            </td>
                                        </tr>
                                        <tr>
                                            <td><label for="phone">联系电话</label></td>
                                            <td><input type="text" id="phone" class="form-control" name="phone" value="${user.phone != null ? user.phone : ''}" placeholder="输入联系电话"></td>
                                        </tr>
                                        <tr>
                                            <td><label for="idcard">身份证号</label></td>
                                            <td><input type="text" id="idcard" class="form-control" name="idcard" value="${user.idcard != null ? user.idcard : ''}" placeholder="输入身份证号"></td>
                                        </tr>
                                    </tbody>
                                </table>
                            </div>
                            
                            <div class="form-group headpic-group">
                                <label for="headpic">更换头像</label>
                                <input type="file" id="headpic" class="form-control" name="file" accept=".png,.jpg,.gif" placeholder="选择新头像">
                                <p class="help-text">不选择则保持原头像</p>
                            </div>
                            
                            <div class="btn-group">
                                <button type="submit" class="btn btn-primary">
                                    <i class="fas fa-save"></i> 保存修改
                                </button>
                                <button type="button" class="btn btn-secondary" onclick="window.location.href='user/profile'">
                                    <i class="fas fa-times"></i> 取消
                                </button>
                            </div>
                        </form>
                    </c:otherwise>
                </c:choose>
            </div>
        </c:if>
    </div>
</div>

<script>
    // 切换到编辑模式
    function switchToEditMode() {
        window.location.href = 'user/profile?editMode=true';
    }
</script>
</body>
</html>